<template>
  <div id="app">
    <div class="error-page" v-if="invalidRoute">
      <div class="error-code">4<span>0</span>4</div>
      <div class="error-desc">啊哦~ 你所访问的页面不存在</div>
      <div class="error-handle">
          <router-link to="/">
            <el-button type="primary" size="large">返回首页</el-button>
          </router-link>
          <el-button class="error-btn" type="primary" size="large" @click="goBack">返回上一页</el-button>
      </div>
    </div>
    <router-view v-else></router-view>
  </div>
</template>

<script>
export default {
  computed: {
      invalidRoute () {
        return false;//!this.$route.matched || this.$route.matched.length === 0;
      }
  },
  methods: {
    goBack:function(){
      history.go(-1);
    },
    startHacking () {
      if(localStorage.getItem("isnotify")!="true"){
        localStorage.setItem("isnotify","true");
        this.$notify({
          title: '欢迎！',
          type: 'success',
          message: '欢迎来到比一比学习网，这将给你带来不一样得学习体验！',
          duration: 0,
          position: 'bottom-right'
        });
      }
    }
  },
  mounted:function(){
    this.startHacking();
  }
}
</script>

<style>
  body { margin: 0px; padding: 0px; overflow: hidden; }
  #app {
    font-family: 'Avenir', Helvetica, Arial, sans-serif;
    min-width: 350px;
  }
  /*全局滚动条*/
  /* 设置滚动条的样式 */
  ::-webkit-scrollbar {    width: 5px;}/* 滚动槽 */
  ::-webkit-scrollbar-track {    
      -webkit-box-shadow: inset 0 0 0px rgba(199, 192, 201, 0.2);    
  }
  /* 滚动条滑块 */
  ::-webkit-scrollbar-thumb {    
      border-radius: 8px;    
      background: rgba(199, 192, 201, 0.2);    
      -webkit-box-shadow: inset 0 0 0px rgba(199, 192, 201, 0.2);
  }
  ::-webkit-scrollbar-thumb:window-inactive {    
      background: rgba(233,36,45, 0.4);
  }
</style>
